import React, { Component, Fragment } from 'react';
import Topbar from "../components/topbar"
import {Router,Bg} from "../styled/router" ;
import {CloseOutlined,SearchOutlined} from "@ant-design/icons"
export default class router extends Component {
    constructor(props){
        super(props)
    }
    clickRouter(router){
        this.props.history.push(`/${router}`)
    }
    jumpRouter(){
        this.props.history.push("/index")
    }
    //路由传参的跳转路径
    clickRouter_cang(router,kind){
        this.props.history.push({pathname:router+"/"+kind})
    }
    render() {
        return (
           <Fragment>
               <Bg>
             <Topbar> 
                <CloseOutlined onClick={()=>{this.jumpRouter()}}/>
                <p></p>
                <SearchOutlined />
            </Topbar>
            <Router>
               {/* 组件 */}
            <div>
                <p onClick={this.clickRouter.bind(this,"index")}><span>首</span><span>页</span></p>
                <p onClick={this.clickRouter.bind(this,"text")}><span>文</span><span>字</span></p>
                <p onClick={this.clickRouter_cang.bind(this,"/detlist",2)}><span>声</span><span>音</span></p>
                <p onClick={this.clickRouter_cang.bind(this,"/detlist",3)}><span>影</span><span>像</span></p>
                <p onClick={this.clickRouter.bind(this,"talkabout")}><span>谈</span><span>论</span></p>
                <p onClick={this.clickRouter.bind(this,"index")}><span>单</span><span>向</span><span>历</span></p>
            </div>
            </Router>
            </Bg>
            </Fragment>
        )
    }
}
